import userInfo from '@/views/user-info';
import req from '@utils/request'
import { Tabs } from 'antd'
import { useEffect, useState } from 'react'



const MomentList = ({fromChildrenCircleId,commentUpdate }) => {
    const [circleList, setCircleList] = useState([]);

    const onChange = (key) => {
        // console.log("父类切换："+key);
    };
    const get_Montent_list = () => {
        req({
            method: 'get',
            url: '/share/circle/list'
        }, '/circle').then(res => {
            if (!res.success) return;
            setCircleList(res.data);
        });
    };
    const circleIdToParent = (id) => {
        fromChildrenCircleId(id);
    }
    useEffect(() => {
        get_Montent_list();
    }, [commentUpdate]);
    return (
        <>
            <Tabs
                defaultActiveKey="1"
                onChange={onChange}
                items={
                    circleList.map(circle => ({
                      label: circle.circleName,
                      key: circle.id,
                      children:
                        <div style={{ display: 'flex', flexWrap: 'wrap'} }>
                          {
                            circle.children.map(childrens =>
                              <div className='pop-content-item'
                               key={childrens.id} onClick={() => circleIdToParent(childrens.id)}>
                                <img src={childrens.icon} className='item-img' />
                                <span className='item-name'>{childrens.circleName}</span>
                              </div>
                            )
                          }
                        </div>
                    }))
                  }
            />
        </>
    )
}

export default MomentList
